<script setup>
	import {
		toRefs,
		defineEmits,
	} from 'vue'
	import {
		Search
	} from '@element-plus/icons-vue'

	const props = defineProps({
		show: {
			type: Boolean,
			required: true,
			default: false
		}
	})
	const emits = defineEmits(['update:show'])
	let {
		show
	} = toRefs(props)

	const onConfirm = () => {
		emits('update:show', false)
	}
	const handleClose = () => {
		emits('update:show', false)
	}
</script>
<template>
	<div>
		<el-dialog :modelValue="show" title="联系我们" width="500" @close="handleClose">
			<div class="contact-content">
				<p>
					扫描右侧二维码联系在线客服，或拨打客服热线 18922836153 <br>
					工作时间:周一至周五 8:00-18:00
				</p>
				<img src="../../../assets/img/code.png" alt="" />
			</div>
			<div class="contact-foot">
				<el-button type="warning" @click="onConfirm">
					确 定
				</el-button>
			</div>
		</el-dialog>
	</div>
</template>


<style scoped lang="scss">
	.contact-content {
		display: flex;
		align-items: center;
	}

	.contact-content p {
		font-size: 16px;
		margin-right: 20px;
	}

	.contact-content img {
		width: 100px;
		height: 100px;
	}

	.contact-foot {
		text-align: center;
		padding: 20px 0 0;
	}

	.views-btn {
		color: #999;
	}

	.views-btn:hover {
		text-decoration: underline;
	}
</style>